import 'package:flutter/material.dart';
import 'package:power_house/widgets/common_image.dart';

class SearchBar extends StatefulWidget {
  final bool? showLocation; //展示位置按钮
  final Function? goBackCallback; //回退按钮函数
  final String? inputValue; //搜索框输入值
  final String? defaultInputValue; //搜索框默认值
  final Function? onCancel; //取消按钮
  final bool? showMap; //展示地图按钮
  final Function? onSearch; //用户点击搜索框触发
  final ValueChanged<String>? onSearchSubmit; //用户点击搜索词后点击键盘搜索按钮触发

  const SearchBar({Key? key, this.showLocation, this.goBackCallback, this.inputValue = '', this.defaultInputValue = '请输入搜索词', this.onCancel, this.showMap, this.onSearch, this.onSearchSubmit}) : super(key: key);

  @override
  State<SearchBar> createState() => _SearchBarState();
}

class _SearchBarState extends State<SearchBar> {
  String _searchWord = '';
  late FocusNode _focus;
  late TextEditingController _controller;

  void _onClear() {
    _controller.clear();
    setState(() {
      _searchWord = '';
    });
  }

  @override
  void initState() {
    _focus = FocusNode();
    _controller = TextEditingController(text: widget.inputValue);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        if (widget.showLocation ?? false)
          Padding(
            padding: const EdgeInsets.only(right: 10.0),
            child: GestureDetector(
              onTap: () {},
              child: Row(
                children: const [
                  Icon(
                    Icons.room,
                    color: Colors.green,
                    size: 16.0,
                  ),
                  Text(
                    '郑州',
                    style: TextStyle(color: Colors.black, fontSize: 14.0),
                  ),
                ],
              ),
            ),
          ),
        if (widget.goBackCallback != null)
          Padding(
            padding: const EdgeInsets.only(right: 10.0),
            child: GestureDetector(
              onTap: (widget.goBackCallback ?? () {}) as GestureTapCallback,
              child: const Icon(
                Icons.chevron_left,
                color: Colors.black87,
              ),
            ),
          ),
        Expanded(
          child: Container(
            height: 34.0,
            decoration: BoxDecoration(borderRadius: BorderRadius.circular(20.0), color: Colors.grey[200]),
            margin: const EdgeInsets.only(right: 10.0),
            child: TextField(
              focusNode: _focus,
              onTap: () {
                if (widget.onSearch != null) {
                  widget.onSearch!();
                  if (widget.onSearchSubmit == null) {
                    _focus.unfocus();
                  }
                }
              },
              onSubmitted: widget.onSearchSubmit,
              //键盘回车改为搜索
              textInputAction: TextInputAction.search,
              onChanged: (String value) {
                setState(() {
                  _searchWord = value;
                });
              },
              controller: _controller,
              style: const TextStyle(fontSize: 14.0),
              decoration: InputDecoration(
                  //去除EditText默认的地步下划线
                  border: InputBorder.none,
                  contentPadding: const EdgeInsets.only(top: -1.0),
                  hintText: '请输入搜索词',
                  hintStyle: const TextStyle(color: Colors.grey, fontSize: 14.0),
                  //前置图标
                  suffixIcon: GestureDetector(
                    onTap: () {
                      _onClear();
                    },
                    child: Icon(
                      Icons.clear,
                      size: 18.0,
                      color: _searchWord == '' ? Colors.grey[200] : Colors.grey,
                    ),
                  ),
                  //后置图标
                  icon: const Padding(
                    padding: EdgeInsets.only(left: 10, top: 2),
                    child: Icon(
                      Icons.search,
                      size: 18.0,
                      color: Colors.grey,
                    ),
                  )),
            ),
          ),
        ),
        if (widget.onCancel != null)
          Padding(
            padding: const EdgeInsets.only(right: 10.0),
            child: GestureDetector(
              onTap: (widget.onCancel ?? () {}) as GestureTapCallback,
              child: const Text(
                '取消',
                style: TextStyle(color: Colors.black, fontSize: 14.0),
              ),
            ),
          ),
        if (widget.showMap ?? false) const CommonImage('static/icons/widget_search_bar_map.png')
      ],
    );
  }
}
